body {
	margin: 0;
}
h1{
	font-family: 'Lato', 'sans-serif';
	font-weight: 300;
	font-size: 100px;
}
.header{
	position: relative;
	text-align: center;
	/* 背景渐变 */
	background: linear-gradient(60deg, rgba(84,58,183,1) 0%, 
		rgba(0,172,193,1) 100%);
	color: wheat;
}
.lnner-header{
	height: 73vh;
	width: 100%;
	margin: 0;
	padding: 0;
	/* 垂直居中 */
	display: flex;
	justify-content: center;
	align-items: center;
}
.waves{
	position: relative;
	width: 100%;
	height: 15vh;
	margin-bottom: -7px;
	min-height: 100px;
	max-height: 150px;
}
.parallax>use{
	animation: move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite;
}
.parallax>use:nth-child(1){
	animation-delay: -2s;
	animation-duration: 7s;
}
.parallax>use:nth-child(2){
	animation-delay: -3s;
	animation-duration: 10s;
}
.parallax>use:nth-child(3){
	animation-delay: -4s;
	animation-duration: 13s;
}
.parallax>use:nth-child(4){
	animation-delay: -5s;
	animation-duration: 16s;
}
/* 动画 */
@keyframes move-forever{
	0% {
		transform: translate3d(-90px,0,0);
	}
	100% {
		transform: translate3d(85px,0,0);
	}
}
/* 当屏幕小于 768px 执行 */
@media (max-width: 768px) {
	.waves{
		height: 40px;
		min-height: 40px;
	}
	h1{
		font-size: 24px;
	}
}